<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/>
    <title>用户信息修改--layui后台管理模板</title>
    <meta name="renderer" content="webkit"/>
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"/>
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1"/>
    <meta name="apple-mobile-web-app-status-bar-style" content="black"/>
    <meta name="apple-mobile-web-app-capable" content="yes"/>
    <meta name="format-detection" content="telephone=no"/>
    <link rel="stylesheet" href="/layui/css/layui.css" media="all"/>
    <style type="text/css">
        .layui-form-item .layui-inline {
            width: 33.333%;
            float: left;
            margin-right: 0;
        }

        @media (max-width: 1240px) {
            .layui-form-item .layui-inline {
                width: 100%;
                float: none;
            }
        }
    </style>
</head>
<body class="childrenBody">
<form class="layui-form" id="addForm">
    <div class="layui-form-item">
        <label class="layui-form-label">昵称</label>
        <div class="layui-input-block">
            <input id="userName" name="userName" type="text" class="layui-input newsName" lay-verify="required"
                   placeholder="请输入用户名"/>
        </div>
    </div>
    <div class="layui-form-item">
        <label class="layui-form-label">密码</label>
        <div class="layui-input-block">
            <input id="password" name="password" type="password" class="layui-input newsName" lay-verify="required"
                   placeholder="请输入密码"/>
        </div>
    </div>
    <div class="layui-form-item">
        <label class="layui-form-label">手机号码</label>
        <div class="layui-input-block">
            <input id="linkTel" name="linkTel" type="number" class="layui-input newsName" required lay-verify="linkTel"
                   placeholder="请输入手机号码"/>
            <div id="linkTelError" style="color: red; display: none;">手机号不符合格式</div>
        </div>
    </div>
    <div class="layui-form-item">
        <label class="layui-form-label">省份</label>
        <div class="layui-input-inline">
            <select id="province" name="province" class="newsLook" lay-filter="browseLook">
                <option value="1">北京</option>
                <option value="2">天津</option>
                <option value="3">上海</option>
                <option value="4">重庆</option>
                <option value="5">河北</option>
                <option value="6">河南</option>
                <option value="7">云南</option>
                <option value="8">辽宁</option>
                <option value="9">黑龙江</option>
                <option value="10">湖南</option>
                <option value="11">安徽</option>
                <option value="12">山东</option>
                <option value="13">新疆</option>
                <option value="14">江苏</option>
                <option value="15">浙江</option>
                <option value="16">江西</option>
                <option value="17">湖北</option>
                <option value="18">广西</option>
                <option value="19">甘肃</option>
                <option value="20">山西</option>
                <option value="21">内蒙古</option>
                <option value="22">陕西</option>
                <option value="23">吉林</option>
                <option value="24">福建</option>
                <option value="25">贵州</option>
                <option value="26">广东</option>
                <option value="27">青海</option>
                <option value="28">西藏</option>
                <option value="29">四川</option>
                <option value="30">宁夏</option>
                <option value="31">海南</option>
                <option value="32">台湾</option>
                <option value="33">香港</option>
                <option value="34">澳门</option>
            </select>
        </div>
    </div>
<!--    <div class="layui-form-item">-->
<!--        <label class="layui-form-label">状态</label>-->
<!--        <div class="layui-input-inline">-->
<!--            <select id="state" name="state" class="newsLook" lay-filter="browseLook">-->
<!--                <option value="0" checked="checked">业务员</option>-->
<!--                <option value="1">注销</option>-->
<!--            </select>-->
<!--        </div>-->
<!--    </div>-->
    <div class="layui-form-item">
        <div class="layui-input-block">
            <button class="layui-btn" type="submit" lay-submit lay-filter="formSubmit">保存</button>
            <a class="layui-btn" th:href="@{/manager_user_list}">返回</a>
            <button type="reset" class="layui-btn layui-btn-primary">重置</button>
        </div>
    </div>
</form>
<!--<script type="text/javascript" src="/layui/layui.js"></script>-->
<script type="text/javascript" src="/js/layui/layui.js"></script>
<script type="text/javascript" src="/js/user/addUser.js"></script>
<script type="text/javascript" src="/js/jquery-1.7.2.js"></script>
<script type="text/javascript">
    // 身份证验证
    function validateInput(input) {
        input.value = input.value.replace(/[^0-9Xx]/g, '');
    }

    layui.use(['form','layer'], function(){
        var form = layui.form;
        var layer = layui.layer;

        // 表单提交
        form.on('submit(formSubmit)', function(data) {
            // 获取所有表单数据
            var formData = $('#addForm').serializeArray();
            // 将表单数据转换为对象格式
            var formDataObject = {};
            $.each(formData, function(i, field){
                formDataObject[field.name] = field.value;
            });

            // 使用 Ajax 发送请求
            $.ajax({
                type: 'POST',
                url: '/manager_user_add',
                data: JSON.stringify(formDataObject),
                contentType: 'application/json',
                success: function(response) {
                    layer.msg('新增成功', {
                        time: 2000, //2s后自动关闭
                    }, function () {
                        location.href = "/manager_user_list";
                    });
                },
                error: function(error) {
                    layer.msg('新增异常', {
                        time: 2000, //2s后自动关闭
                    });
                }
            });

            return false; // 阻止表单跳转。如果需要表单跳转，去掉这行代码。
        });
    });
</script>

</body>
</html>